import { Card } from "antd";
import "../../../common/common.css";

export const PanelAssembleData = [
    {
        key: "1",
        label: "对数组的每一项进行统计",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="countBy" className="lodashCard">
                    <p>
                        _.countBy(collection, [iteratee=_.identity]) <br />
                        <b>【 返回一个对象，key是处理数组的结果，value是次数 】</b>
                    </p>
                    <p>创建一个组成对象，key（键）是经过 iteratee（迭代函数） 执行处理collection中每个元素后返回的结果，每个key（键）对应的值是 iteratee（迭代函数）返回该key（键）的次数（注：迭代次数）。 iteratee 调用一个参数：(value)。</p>
                    <p>返回object</p>
                </Card>
            </div>
        ),
    },
    {
        key: "2",
        label: "遍历",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="forEach【_.each】" className="lodashCard">
                    <p>
                        _.forEach(collection, [iteratee=_.identity]) <br />
                        <b>【 遍历每一个元素执行function 】</b>
                    </p>
                    <p>
                        调用 iteratee 遍历 collection(集合) 中的每个元素， iteratee 调用3个参数： (value, index|key, collection)。 如果迭代函数（iteratee）显式的返回 false ，迭代会提前退出。注意: 与其他'集合'方法一样，类似于数组，对象的
                        'length' 属性也会被遍历。想避免这种情况，可以用_.forIn 或者_.forOwn 代替。
                    </p>
                    <p>返回处理结果</p>
                </Card>
                <Card title="forEachRight" className="lodashCard">
                    <p>
                        _.forEachRight(collection, [iteratee=_.identity]) <br />
                        <b>【 遍历每一个元素执行function，从末尾开始 】</b>
                    </p>
                    <p>这个方法类似_.forEach，不同之处在于，_.forEachRight 是从右到左遍历集合中每一个元素的。</p>
                    <p>返回处理结果</p>
                </Card>
                <Card title="every" className="lodashCard">
                    <p>
                        _.every(collection, [predicate=_.identity]) <br />
                        <b>【 对数组进行处理查看是否每一项都符合迭代器规则 】</b>
                    </p>
                    <p>
                        通过 predicate（断言函数） 检查 collection（集合）中的 所有 元素是否都返回真值。一旦 predicate（断言函数） 返回假值，迭代就马上停止。predicate（断言函数）调用三个参数： (value, index|key, collection)。注意:
                        这个方法对于对于空集合返回 true，因为空集合的任何元素都是 true 。
                    </p>
                    <p>返回boolean值</p>
                </Card>
                <Card title="forEach" className="lodashCard">
                    <p>
                        _.forEach(collection, [iteratee=_.identity]) <br />
                        <b>【 遍历集合的元素执行处理 】</b>
                    </p>
                    <p>
                        调用 iteratee 遍历 collection(集合) 中的每个元素， iteratee 调用3个参数： (value, index|key, collection)。 如果迭代函数（iteratee）显式的返回 false ，迭代会提前退出。注意: 与其他'集合'方法一样，类似于数组，对象的
                        'length' 属性也会被遍历。想避免这种情况，可以用_.forIn 或者_.forOwn 代替。
                    </p>
                    <p>返回处理结果</p>
                </Card>
                <Card title="forEachRight" className="lodashCard">
                    <p>
                        _.forEachRight(collection, [iteratee=_.identity]) <br />
                        <b>【 遍历集合的元素执行处理，从右到左 】</b>
                    </p>
                    <p>这个方法类似_.forEach，不同之处在于，_.forEachRight 是从右到左遍历集合中每一个元素的。</p>
                    <p>返回处理结果</p>
                </Card>
                <Card title="groupBy" className="lodashCard">
                    <p>
                        _.groupBy(collection, [iteratee=_.identity]) <br />
                        <b>【 创建一个对象循环执行每一项，将执行结果相同的项作为key，每个元素项是value 】</b>
                    </p>
                    <p>
                        创建一个对象，key 是 iteratee 遍历 collection(集合) 中的每个元素返回的结果。 分组值的顺序是由他们出现在 collection(集合) 中的顺序确定的。每个键对应的值负责生成 key 的元素组成的数组。iteratee 调用 1 个参数： (value)。
                    </p>
                    <p>返回object</p>
                </Card>
                <Card title="keyBy" className="lodashCard">
                    <p>
                        _.keyBy(collection, [iteratee=_.identity]) <br />
                        <b>【 对每个元素进行处理返回一个object，key是处理后的结果，value是生成key的最后一个元素 】</b>
                    </p>
                    <p>创建一个对象组成， key（键） 是 collection（集合）中的每个元素经过 iteratee（迭代函数） 处理后返回的结果。 每个 key（键）对应的值是生成key（键）的最后一个元素。iteratee（迭代函数）调用1个参数：(value)。</p>
                    <p>返回object</p>
                </Card>
                <Card title="map" className="lodashCard">
                    <p>
                        _.map(collection, [iteratee=_.identity]) <br />
                        <b>【 对集合的每个元素进行处理，结果放入数组进行返回 】</b>
                    </p>
                    <p>
                        创建一个数组， value（值） 是 iteratee（迭代函数）遍历 collection（集合）中的每个元素后返回的结果。 iteratee（迭代函数）调用3个参数： (value, index | key, collection). lodash
                        中有许多方法是防止作为其他方法的迭代函数（注：即不能作为iteratee参数传递给其他方法），例如：_.every, _.filter, _.map, _.mapValues, _.reject, 和_.some。 受保护的方法有（注：即这些方法不能使用_.every, _.filter, _.map,
                        _.mapValues, _.reject, 和_.some作为 iteratee 迭代函数参数） ： ary, chunk, curry, curryRight, drop, dropRight, every, fill, invert, parseInt, random, range, rangeRight, repeat, sampleSize, slice, some, sortBy, split,
                        take, takeRight, template, trim, trimEnd, trimStart, and words
                    </p>
                    <p>返回array</p>
                </Card>
                <Card title="reduce" className="lodashCard">
                    <p>
                        _.reduce(collection, [iteratee=_.identity], [accumulator]) <br />
                        <b>【 遍历集合，每次返回值作为下一次迭代使用，可以用于统计数组值或者对象数组某一属性总计结果 】</b>
                    </p>
                    <p>
                        压缩 collection（集合）为一个值，通过 iteratee（迭代函数）遍历 collection（集合）中的每个元素，每次返回的值会作为下一次迭代使用(注：作为iteratee（迭代函数）的第一个参数使用)。 如果没有提供 accumulator，则
                        collection（集合）中的第一个元素作为初始值。(注：accumulator参数在第一次迭代的时候作为iteratee（迭代函数）第一个参数使用。) iteratee 调用4个参数： (accumulator, value, index|key, collection). lodash
                        中有许多方法是防止作为其他方法的迭代函数（注：即不能作为iteratee参数传递给其他方法），例如：_.reduce,_.reduceRight, 和_.transform。 受保护的方法有（注：即这些方法不能使用_.reduce,_.reduceRight, 和_.transform作为
                        iteratee 迭代函数参数）： assign, defaults, defaultsDeep, includes, merge, orderBy, 和 sortBy
                    </p>
                    <p>返回累加结果</p>
                </Card>
                <Card title="reduceRight" className="lodashCard">
                    <p>
                        _.reduceRight(collection, [iteratee=_.identity], [accumulator]) <br />
                        <b>【 类似reduce，从右到左遍历 】</b>
                    </p>
                    <p>这个方法类似_.reduce ，除了它是从右到左遍历collection（集合）中的元素的。</p>
                    <p>返回累加结果</p>
                </Card>
            </div>
        ),
    },
    {
        key: "3",
        label: "筛选查找",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="filter" className="lodashCard">
                    <p>
                        _.filter(collection, [predicate=_.identity]) <br />
                        <b>【 遍历数组返回符合迭代器规则的数据 】</b>
                    </p>
                    <p>遍历 collection（集合）元素，返回 predicate（断言函数）返回真值 的所有元素的数组。 predicate（断言函数）调用三个参数：(value, index|key, collection)。Note: Unlike_.remove, this method returns a new array.</p>
                    <p>返回过滤后的array</p>
                </Card>
                <Card title="partition" className="lodashCard">
                    <p>
                        _.partition(collection, [predicate=_.identity]) <br />
                        <b>【 按照判断规则将数组内容划分为符合与不符合两个数组 】</b>
                    </p>
                    <p>创建一个分成两组的元素数组，第一组包含predicate（断言函数）返回为 truthy（真值）的元素，第二组包含predicate（断言函数）返回为 falsey（假值）的元素。predicate 调用1个参数：(value)。</p>
                    <p>返回array</p>
                </Card>
                <Card title="find" className="lodashCard">
                    <p>
                        _.find(collection, [predicate=_.identity], [fromIndex=0]) <br />
                        <b>【 遍历集合找到符合条件的项 】</b>
                    </p>
                    <p>遍历 collection（集合）元素，返回 predicate（断言函数）第一个返回真值的第一个元素。predicate（断言函数）调用3个参数： (value, index|key, collection)。</p>
                    <p>返回匹配的结果</p>
                </Card>
                <Card title="findLast" className="lodashCard">
                    <p>
                        _.findLast(collection, [predicate=_.identity], [fromIndex=collection.length-1]) <br />
                        <b>【 从右到左进行遍历符合预期的项 】</b>
                    </p>
                    <p>这个方法类似_.find ，不同之处在于，_.findLast是从右至左遍历collection （集合）元素的。</p>
                    <p>返回匹配的结果</p>
                </Card>
                <Card title="includes" className="lodashCard">
                    <p>
                        _.includes(collection, value, [fromIndex=0]) <br />
                        <b>【 从指定位置开始检索集合里面是否存在目标value 】</b>
                    </p>
                    <p>
                        检查 value(值) 是否在 collection(集合) 中。如果 collection(集合)是一个字符串，那么检查 value（值，子字符串） 是否在字符串中， 否则使用SameValueZero 做等值比较。 如果指定 fromIndex 是负数，那么从 collection(集合)
                        的结尾开始检索。
                    </p>
                    <p>返回boolean值</p>
                </Card>
            </div>
        ),
    },
    {
        key: "4",
        label: "数组扁平化处理",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="flatMap" className="lodashCard">
                    <p>
                        _.flatMap(collection, [iteratee=_.identity]) <br />
                        <b>【 对数组进行遍历处理后扁平化合并 】</b>
                    </p>
                    <p>创建一个扁平化（注：同阶数组）的数组，这个数组的值来自collection（集合）中的每一个值经过 iteratee（迭代函数） 处理后返回的结果，并且扁平化合并。 iteratee 调用三个参数： (value, index|key, collection)。</p>
                    <p>返回array</p>
                </Card>
                <Card title="flatMapDeep" className="lodashCard">
                    <p>
                        _.flatMapDeep(collection, [iteratee=_.identity]) <br />
                        <b>【 类似_.flatMap 不同之处在于，_.flatMapDeep 会继续扁平化递归映射的结果 】</b>
                    </p>
                    <p>这个方法类似_.flatMap 不同之处在于，_.flatMapDeep 会继续扁平化递归映射的结果。</p>
                    <p>返回array</p>
                </Card>
                <Card title="flatMapDepth" className="lodashCard">
                    <p>
                        _.flatMapDepth(collection, [iteratee=_.identity], [depth=1]) <br />
                        <b>【 类似_.flatMap，不同之处在于，_.flatMapDepth 会根据指定递归深度继续扁平化递归映射结果 】</b>
                    </p>
                    <p>该方法类似_.flatMap，不同之处在于，_.flatMapDepth 会根据指定的 depth（递归深度）继续扁平化递归映射结果。</p>
                    <p>返回array</p>
                </Card>
            </div>
        ),
    },
    {
        key: "5",
        label: "对每个元素调用函数",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="invokeMap" className="lodashCard">
                    <p>
                        _.invokeMap(collection, path, [args]) <br />
                        <b>【 为集合里面的每个元素执行函数，第二个参数是执行的函数，第三个是函数所调用的参数 】</b>
                    </p>
                    <p>
                        调用path（路径）上的方法处理 collection(集合)中的每个元素，返回一个数组，包含每次调用方法得到的结果。任何附加的参数提供给每个被调用的方法。如果methodName（方法名）是一个函数，每次调用函数时，内部的 this
                        指向集合中的每个元素。
                    </p>
                    <p>返回结果数组【array】</p>
                </Card>
            </div>
        ),
    },
    {
        key: "6",
        label: "对象属性排序",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="orderBy" className="lodashCard">
                    <p>
                        _.orderBy(collection, [iteratees=[_.identity]], [orders]) <br />
                        <b>【 对对象属性进行指定规则进行排序（可以先按name再对age排序） 】</b>
                    </p>
                    <p>此方法类似于_.sortBy，除了它允许指定 iteratee（迭代函数）结果如何排序。 如果没指定 orders（排序），所有值以升序排序。 否则，指定为'desc' 降序，或者指定为 'asc' 升序，排序对应值。</p>
                    <p>返回array</p>
                </Card>
                <Card title="sortBy" className="lodashCard">
                    <p>
                        _.sortBy(collection, [iteratees=[_.identity]]) <br />
                        <b>【 对集合执行处理，以处理结果进行排序 】</b>
                    </p>
                    <p>创建一个元素数组。 以 iteratee 处理的结果升序排序。 这个方法执行稳定排序，也就是说相同元素会保持原始排序。 iteratees 调用1个参数： (value)。</p>
                    <p>返回排序后的数组array</p>
                </Card>
            </div>
        ),
    },
    {
        key: "7",
        label: "从集合删除指定条件项",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="reject" className="lodashCard">
                    <p>
                        _.reject(collection, [predicate=_.identity]) <br />
                        <b>【 集合中删除指定条件项 】</b>
                    </p>
                    <p>_.filter的反向方法;此方法 返回 predicate（断言函数） 不 返回 truthy（真值）的collection（集合）元素（注释：非真）。</p>
                    <p>返回array</p>
                </Card>
            </div>
        ),
    },
    {
        key: "8",
        label: "获取随机元素-打乱进行随机",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="sample" className="lodashCard">
                    <p>
                        _.sample(collection) <br />
                        <b>【 获取一个随机元素 】</b>
                    </p>
                    <p>从collection（集合）中获得一个随机元素。</p>
                    <p>返回随机元素</p>
                </Card>
                <Card title="sampleSize" className="lodashCard">
                    <p>
                        _.sampleSize(collection, [n=1]) <br />
                        <b>【 随机获取n个元素 】</b>
                    </p>
                    <p>从collection（集合）中获得 n 个随机元素。</p>
                    <p>返回随机元素array</p>
                </Card>
                <Card title="shuffle" className="lodashCard">
                    <p>
                        _.shuffle(collection) <br />
                        <b>【 打乱集合创建新数组 】</b>
                    </p>
                    <p>创建一个被打乱值的集合。 使用Fisher-Yates shuffle 版本。</p>
                    <p>返回array</p>
                </Card>
            </div>
        ),
    },
    {
        key: "9",
        label: "获取集合长度",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="size" className="lodashCard">
                    <p>
                        _.size(collection) <br />
                        <b>【 返回集合长度 】</b>
                    </p>
                    <p>返回collection（集合）的长度，如果集合是类数组或字符串，返回其 length ；如果集合是对象，返回其可枚举属性的个数。</p>
                    <p>返回number</p>
                </Card>
            </div>
        ),
    },
    {
        key: "10",
        label: "集合有一个符合就返回true",
        children: (
            <div className="centerTextLeft lodashPanel lodashWidth">
                <Card title="some" className="lodashCard">
                    <p>
                        _.some(collection, [predicate=_.identity]) <br />
                        <b>【 集合中有一个符合返回true 】</b>
                    </p>
                    <p>通过 predicate（断言函数） 检查collection（集合）中的元素是否存在 任意 truthy（真值）的元素，一旦 predicate（断言函数） 返回 truthy（真值），遍历就停止。 predicate 调用3个参数：(value, index|key, collection)。</p>
                    <p>返回boolean值</p>
                </Card>
            </div>
        ),
    },
];